$long: 1.1;

.main {
    width: 1000px*$long;
    margin: 0 auto;
    .new{
        min-height: 530px;
        overflow: hidden;
        background: #f3f0eb;
        margin-bottom: 10px;
        .new-top{
            width: 1000px*$long;
            display: flex;
            justify-content: space-between;
            margin-top: 30px;
            padding: 0 30px;
            .new-left{
                width: 320px;
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                margin-bottom: 20px*$long;
                b {
                    font-size: 34px;
                }
                span{
                    color: #999;
                    font-size: 16px;
                    margin-bottom: 5px;
                }
            }
            .new-right{
                margin-right: 72px;
                a{
                    font-size: 16px;
                }
            }
        }
        .new-b{     
            ul{
                width: 1000px*$long;
                display: flex;
                justify-content: space-between;
                box-sizing: border-box;
                padding: 0 10px;
                li{
                    width: 23%;
                    a{
                        width: 100%;
                        height: 50%;
                        img{
                            width: 100%;
                            height: 70%;
                            margin-bottom: 30px;
                            transition: all .5s;
                            &:hover{
                                transform: scale(1.1);
                            }
                        }
                    }
                    span{
                        width: 90%;
                        padding: 0 10px;
                        box-sizing: border-box;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        overflow: hidden;
                    }
                    .price{
                        display: flex;
                        justify-content: space-between;
                        margin-top: 35px;
                        padding: 0 30px;
                        box-sizing: border-box;
                        b{
                            color: red;
                            font-size: 20px;
                        }
                        button{
                            width: 30px;
                            height: 30px;
                            font-size: 20px;
                            cursor: pointer;
                            border: none;
                            background: #b1a17d;
                            color: #fff;
                            border-radius: 8px;
                        }
                    }
                }
            }
        }
    }
    .hot {
        min-height: 730px;
        background: #f3f0eb;
        overflow: hidden;
        .hot-top {
            margin-top: 36px *$long;
            width: 1000px*$long;
            height: 54px*$long;
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-sizing: border-box;
            padding: 0 20px;
            margin-bottom: 16px;
            .hot-left {
                width: 242px *$long;
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                margin-bottom: 20px*$long;

                b {
                    font-size: 34px;
                }
                a {
                    color: #b1a17d;
                    line-height: 28px;
                    border-bottom: 1px solid #b1a17d;
                    font-size: 16px;
                    margin-bottom: 5px;
                    cursor: pointer;
                }
            }

            .hot-right {
                margin-right: 36px;

                a {
                    font-size: 16px;

                }
            }
        }

        .hot-b {
            width: 1000px*$long;
            height: 476px*$long;
            display: flex;
            justify-content: space-between;
            .bigPic{
                width: 610px;
                height: 550px;
                background: #fff;
                padding: 10px;
                margin-left: 10px;
                border-radius: 16px;
                transition: all .5s;
                a{
                    width: 100%;
                    height: 60%;
                    img{
                        width: 100%;
                        height: 60%;
                        border-bottom: 1px solid #f3f0eb;
                        margin-bottom: 40px;
                    }
                }
                &:hover{
                    transform: scale(1.1);
                }
                .text{
                    height: 30%;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    span{
                        width: 302px;
                        font-size: 12px *$long;
                        line-height: 18px*$long;
                    }
                    .price{
                        display: flex;
                        justify-content: space-between;
                        b{
                            display: block;
                            font-size: 26px;
                            color: red;
                            margin-top: 1px;
                        }
                        button{
                            width: 30px;
                            height: 30px;
                            font-size: 20px;
                            cursor: pointer;
                            border: none;
                            background: #b1a17d;
                            color: #fff;
                            border-radius: 8px;
                        }
                    }
                }
            }
            ul {
                display: flex;
                justify-content: space-around;
                flex-wrap: wrap;
                li {
                    width: 186px *$long;
                    height: 234px*$long;
                    background: #fff;
                    padding: 10px;
                    border-radius: 10px;
                    margin:0 0 15px 0;
                    transition: all .5s;
                    &:hover{
                        transform: scale(1.1);
                    }
                    a{
                        width: 100%;
                        height: 50%;
                        img{
                            width: 100%;
                            height: 50%;
                            border-bottom: 1px solid #f3f0eb;
                            margin-bottom: 20px;
                        }
                    }
                    .text{
                        height: 44%;
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        span{
                            width: 196px;
                            font-size: 12px *$long;
                            line-height: 18px*$long;
                            display: -webkit-box;
                            -webkit-box-orient: vertical;
                            -webkit-line-clamp: 2;
                            overflow: hidden;
                        }
                        .price{
                            display: flex;
                            justify-content: space-between;
                            b{
                                display: block;
                                font-size: 26px;
                                color: red;
                                margin-top: 1px;
                            }
                            button{
                                width: 30px;
                                height: 30px;
                                font-size: 20px;
                                cursor: pointer;
                                border: none;
                                background: #b1a17d;
                                color: #fff;
                                border-radius: 8px;
                            }
                        }
                    }
                }
            }
        }
    }
    .list{
        width: 1000px*$long;
        min-height: 320px;
        background: #f3f0eb;
        margin-top: 30px;
        overflow: hidden;
        padding: 30px;
        box-sizing: border-box;
        .list-top{
            width: 280px;
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin: 30px 0 20px 0;
            b{
                font-size: 26px;
            }
            span{
                font-size: 1px;
                color: #999;
            }
        }
        .list-b{
            display: flex;
            justify-content: space-between;
            .list-left{
                width: 575px*$long;
                height: 316px*$long;
            }
            .list-right{
                width: 38%;
                height: 100%;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                .imgBox{
                    width: 325px*$long;
                    height: 154px*$long;
                    margin-bottom: 8px*$long;
                }
            }
        }
    }
}